{block name="style"}
<style>
    form {
        width: calc(100% - 5px);
        height: calc(100% - 15px);
        margin-top: 15px;
    }
</style>
{/block}

{block name="content"}
<form action="{:sysuri()}" method="post" data-auto="true" class="layui-form" lay-filter="shop_add">
    <div class="layui-row layui-col-space10" style="padding: 0 15px;">
        <div class="layui-col-md12">
            <label class="layui-form-label">{:lang("品牌名称")}:</label>
            <div class="layui-input-block">
                <input required name="name" value="{$vo.name|default=''}" class="layui-input">
            </div>
        </div>
        <div class="layui-col-md12">
            <label class="layui-form-label">{:lang("默认分类")}:</label>
            <div class="layui-input-block">
                <input required id="category_id" name="category_id" value="{$vo.category_id|default=0}">
            </div>
        </div>
        <div class="layui-col-md12">
            <label class="layui-form-label">{:lang("说明")}:</label>
            <div class="layui-input-block">
                <div>1、{:lang("请填写Ozon后台品牌属性列表中展示的名称")}；</div>
                <div>2、{:lang("添加完成后请在管理列表页面带点击【同步】按钮将常用品牌状态更改为[已同步]")}；</div>
            </div>
        </div>
    </div>
    <div class="layui-form-item text-center" style="margin-top: 30px;clear: both;">
        <input type="hidden" name="id" value="{$vo.id|default=0}">
        <button class="layui-btn">{:lang('保存数据')}</button>
        <button class="layui-btn layui-btn-danger" type='button' id="close_btn" data-confirm="{:lang('确定要取消编辑吗')}" data-close>{:lang('取消编辑')}</button>
    </div>
</form>
{/block}

{block name="script"}
<link rel="stylesheet" href="__ROOT__/static/plugs/layui_exts/layCascader.css">
<script>
    $(function() {
        let form = layui.form;

        getCurrenList();

        function getCurrenList() {
            $.ajax({
                url: "{:sysuri('common/ajax/getCurrencyList')}",
                type: 'get',
                dataType: 'json',
                success: function(res) {
                    if (res.code == 1) {
                        let data = res.data;
                        let html = '<option value="">{:lang("请选择")}</option>';
                        let currency_id = "{$vo.currency_id|default=''}";
                        for (let i = 0; i < data.length; i++) {
                            if(currency_id){
                                html += '<option value="' + data[i].id + '"'+ (data[i].id == currency_id ? 'selected' : '') + '>' + data[i].currency_name + '</option>';
                            }else{
                                html += '<option value="' + data[i].id + '">' + data[i].currency_name + '</option>';
                            }
                        }

                        $('select[name="currency_id"]').html(html);
                        form.render('select');
                    }else{
                        $.msg.error(res.info)
                        return false;
                    }
                },
                error: function(err){
                    $.msg.error(err.status + err.statusText);
                }
            })
        }
    })

    layui.use(['layCascader'], function () {
        // 选择平台分类
        let layCascader = layui.layCascader;
        let category_data = [];
        let category_id = '{$category_id|default=0}';

        let category_change = layCascader({
            elem:  "#category_id"
            ,placeholder: "{:lang('不选默认顶级分类')}"
            ,clearable: true
            ,value: parseInt(category_id)
            ,props: {
                value: 'id',
                label: 'title',
                children: 'children'
            }
            ,filterable: true
            ,options: category_data
        });

        // 改变分类时触发
        category_change.changeEvent(function (value, node) {
            console.log(value)
            console.log(node)
        });

        getCategoryList()

        function getCategoryList() {
            // 请求获取平台分类
            httpRequest('{:url("getCategoryList")}', {}, 'post', function(msg, res) {
                if(!isNotEmpty(res)) {
                    return false;
                }
                category_change.setOptions(res);
            });
        }
    })
</script>
{/block}